import React, { Component,PropTypes} from 'react';
import {Link} from 'react-router';
import CommonBtn from '../CommonComponent/CommonBtn'
import Top from '../CommonComponent/Top'
import '../../Stylesheets/wx/recharge.css'
import UUID from 'uuid-js'
import {RechargeApply,MyInfo,ProductPropertyCheck,SaveRechargeOrder} from '../../Action/auth';


export default class Recharge extends Component {

    static contextTypes = {
        router:PropTypes.object
    }

    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            payImg:require("../../Images/uploadImg.png"),
            status:false,
            amount:0,
            imgadd:'',
            balance:0,
            orderNo:''
        };
    }

    async componentWillMount(){
        await MyInfo()
            .then(res=>{
                console.log(res.USE_AMOUNT)
                this.setState({
                    balance:res.USE_AMOUNT
                })
            })
            .catch(err=>{
                console.warn('获取资料失败',err)
            })
    }

    async submit(){
        const {total,useAmount,lack} = this.state;
        if(this.refs.amount.value == ''){
            alert("请输入充值金额");
            return;
        }
        await SaveRechargeOrder(this.refs.amount.value,2)
            .then(res=>{
                this.setState({
                    orderNo:res
                })
            })
            .catch(err=>{
                console.warn('获取资料失败',err)
            })
        if(this.props.location.query.purchase){
            this.context.router.push({pathname:'/uploadImg',
                query:{
                    tranType:2,
                    orderNos:this.state.orderNo,
                    payMuchMoney:this.refs.amount.value,
                    isRecharge:2,
                    purchase:2,
                    type:1
                }
            })
        }else{
            this.context.router.push({pathname:'/uploadImg',
                query:{
                    tranType:2,
                    orderNos:this.state.orderNo,
                    payMuchMoney:this.refs.amount.value,
                    isRecharge:2,
                    purchase:0,
                    type:1
                }
            })
        }



    }

/*

    submit = () =>{
        const {payImg,imgadd} = this.state;
        const amount = this.refs.amount.value;
        if(this.state.status&&amount!=null&&amount>0){
            console.log(payImg+'====='+amount)
            RechargeApply(imgadd,amount)
                .then(res=>{
                    alert('申请充值已提交，请耐心等待')
                    history.go(-1)
                })
                .catch(err=>{
                    alert(err)
                    console.warn('获取资料失败',err)
                })
        }else{
            alert('请填写充值金额与上传图片')
        }
    }*/

/*    handleChange = (name, value) => {
        this.setState(({valueGroups}) => ({
            valueGroups: {
                ...valueGroups,
                [name]: value
            }
        }));
    };*/

    render(){
        return(
            <div>
                <Top
                    title ={'申请充值'}
                />
                <div className="containerNav" style={{top:50}}>

                    <div className="pAll">
                        <div className="f14 flex flex-pack-justify">
                            <div>
                            <span className="" >
                                品牌:
                            </span>
                                <span className="ml1">维魅力</span>
                            </div>
                            <div>
                            <span>
                                当前货款
                            </span>
                                <span className="ml1">￥{this.state.balance}</span>
                            </div>
                        </div>
                        <div className="mt1" style={{height:40}}>
                            <input
                                className="width100 height100 border_gray paddinglr f14"
                                type="text"
                                placeholder="请输入金额(必填)"
                                ref="amount"
                            />
                        </div>
                        <div style={{marginTop:'3rem'}}>
                            <div>
                                <div className="flex">
                                    <div className="flex-1">
                                        <CommonBtn title ={'提交'}
                                                   style={{marginBottom:'0.5rem',fontSize:14}}
                                                   onClick={()=>this.submit()}
                                        />
                                    </div>
                                </div>

                            </div>

                        </div>
                        {/*     <Link to="/rechareRecord">
                            <div className="tc f18" style={{color:'#1195FF',marginTop:30}}>
                                查看充值记录>>
                            </div>
                        </Link>*/}
                    </div>

                </div>
            </div>
        )
    }

}